<template>
 <div class="containt">
     <ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media" v-for="(item,index) in list" :key="item.time">
					<router-link :to="'/home/newsinfo/' + index" >
						<img class="mui-media-object mui-pull-left" :src="item.pic">
						<div class="mui-media-body">
							<h1 v-html="item.title"></h1>
							<p class='mui-ellipsis'>
                                <span>发表时间：{{item.time}}</span>
                                <span>点击次数：0</span>

                            </p>
						</div>
					</router-link>
				</li>
           
			</ul>
 </div>
</template>  

<script>
// import axios from 'axios'
 import { Toast } from 'mint-ui';
export default {
    data(){
		return{
			list:[]
		}
	},
	methods: {
		getNewList(){//获取新闻列表  jsonp解决跨域问题
			this.$http.jsonp('https://api.jisuapi.com/news/get?channel=%E5%A4%B4%E6%9D%A1&start=4&num=40&appkey=2aab973f248a3b34').then(resoult => {
				console.log(resoult.body.result.list)
				if(resoult.body.status == 0){
					this.list=resoult.body.result.list
					Toast('加载成功')
				}else{
					Toast('加载失败')
				}
			})
		}
	},
	created() {
		this.getNewList()
	},
}
</script>

<style lang="scss" scoped>
.containt{
    overflow: hidden;
}
.mui-media-body{
    h1{
         font-size:16px;
		 text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
    }
    .mui-ellipsis{
        font-size:12px;
        color:rgb(35, 42, 144);
        display:flex;
        justify-content: space-between;
    }
}
 
</style>